<template>
  <div class="head">
    <div class="col-md-12" style="padding:0px;">
      <div class="y_top v2016-6-29">
        <div class="y_top_left">
          <img class="imgvl" src="../images/y_logo.png" />
        </div>
        <div class="y_top_right">
          <div class="con"><!--setUrl('/taskInfoManage/taskInfoList.do?comCode=&personID')-->
            <a class="right hongdian" @click="addTabsclick($event);avisited($event)" title="我的任务" id="218" :url="task">
              <img src="../images/hongdian-1.png" />
              <span class="positionbg" id="redSpan" style="display:none"><i class="position" id="taskRedPoint">0</i></span>
              <span class="info">任务</span>
            </a>
            <a class="right hongdian" @click="addTabsclick($event);avisited($event)" title="我的消息" id="276" :url="news">
              <img src="../images/hongdian-2.png" />
              <span class="positionbg" id="messageSpan" style="display:none"><i class="position" id="messageRedPoint">0</i></span>
              <span class="info">消息</span>
            </a>
          </div>
          <div class="con conright">
            <a class="right" @click="addTabsclick($event);avisited($event)" title="个人中心" id="22" :url="conter">
              <img src="../images/person.png" /><span class="info" v-text="personName"></span>
            </a>
            <a @click="ext" class="right">
              <img src="../images/out.png" id="logoutId" /><span class="info">退出</span>
            </a>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  let Base64 = require('js-base64').Base64;
export default {
  name: 'head',
  data () {
    return {
      personName:'',
      task:'taskInfoManage/taskInfoList.do',
      news:'health/myMessageList.do',
      conter:'staffManage/staffCenterQuery.do'
    }
  },
  created(){
    this.task = this.base64Encode(this.task);
    this.news = this.base64Encode(this.news);
    this.conter = this.base64Encode(this.conter);
    const user = JSON.parse(sessionStorage.getItem("user"));
    this.personName = user.personName;
  },
  methods:{
    base64Encode(url){
      const user = JSON.parse(sessionStorage.getItem("user"));
      var params = "&"+Tools.Nformat("comCode={0}&userCode={1}",user.comCode,user.personID);
      if(url.indexOf("?") < 0){
        params = Tools.Nformat("?{0}",params);
      }
      url = Base64.encode(url+params).replace("/","[x]");
      return url;
    },
    addTabsclick(e){
      let url = $(e.target).parent().attr("url");
      let title = $(e.target).parent().attr("title");
      let id = $(e.target).parent().attr("id");
      this.addTabs({id:id,title: title,close: true,click: true,url:url });
    },
    ext(){
      this.$router.replace("/login");
      window.location.replace("/login");
      this.$router.push("/login");
    },
    avisited (e) {
      $(e.target).addClass("visited");
      $(e.target).parent().parent().siblings().find(".visited").removeClass("visited");
      $(e.target).parent().parent().parent().parent().siblings().find(".visited").removeClass("visited");
    },
    addTabs (options) {
      const self = this;
      var id,title,content;
      id = "tab_" + options.id;
      $(".active").removeClass("active");
      if (!$("#tab_" + id)[0]) {
        title = '<li role="presentation" id="tab_' + id + '"><a href="#' + id + '" aria-controls="' + id + '" role="tab" data-toggle="tab" data-url="/spaBasis/'+options.url+'">' + options.title;
        if (options.close) {
          title += ' <i class="glyphicon glyphicon-remove" tabclose="' + id + '">X</i>';
        }
        title += '</a></li>';
        if (options.content) {
          content = '<div role="tabpanel" class="tab-pane" id="' + id + '">' + options.content + '</div>';
        } else {
          content = '<div role="tabpanel" class="tab-pane" id="' + id + '"></div>';
        }
        $(".nav-tabs").prepend(title);
      }
      $("#tab_" + id).addClass('active');
      $("#" + id).addClass("active");
      let base64Url = Base64.decode(options.url);
      let toUrl = URLS.basis +"/"+ base64Url.replace("[x]","/").replace(".do1",".do?");
      $("#spaBasisIfs").attr("src",toUrl);
      self.resize();
    },
    tabslisum () {
      var sum = 0;
      $(".nav-tabs li").each(function(){
        sum += $(this).width();
      })
      return sum;
    },
    resize () {
      var contentWidth = $(".main-content").width();
      var tabwidth = this.tabslisum();
      if(contentWidth < tabwidth){
        $(".nav-tabs-bar").show();
      }else{
        $(".nav-tabs-bar").hide();
      }
    }
  }
}
</script>

<style scoped >
  @import "../css/system_style.css";
</style>
